<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>选择器</title>
    <!-- 测试css几种常见的选择器 -->

    <style>
        /* 标签 */
        h1{
            text-align: center;
            font-size: 50px;
            color: aqua;
            padding-top: 30px;
        }
        /* 类选择器*/
        /*文本输入框*/
        .text_u{
            height: 24px;
            width: 220px;
            padding-left: 5px;
            border: 2px #191c1c solid;
            border-radius: 5px;
        }
        /*id选择器*/
        /*按钮*/
        #sub{
            height: 30px;
            width: 100px;
            background-color: aqua;
            border: aqua inset;
            border-radius: 5px;
        }
        #sub_center{
            text-align: center;
        }

        hr{
            border:1px red solid;
        }
    </style>

</head>

<body>

<hr>

    <h1>用户注册</h1>
    <table align="center" cellpadding="4px">
        <from>
            <tr>
                <td><label for="username">账号:</label></td>
                <td><input type="text" id="username" name="username" class="text_u" placeholder="这是账号哦" /></td>
            </tr>
            <tr>
                <td><label for="password">密码:</label></td>
                <td><input type="password" id="password" class="text_u" name="password"/></td>
            </tr>
            <tr>
                <td><label>性别:</label></td>
                <td><input type="radio" name="gender" value="man" checked/>男 &nbsp;&nbsp;
                    <input type="radio" name="gender" value="woman"/>女</td>
            </tr>
            <tr>
                <td><label>爱好：</label></td>
                <td>
                    <input type="checkbox" name="hobby" value="sing">唱歌
                    <input type="checkbox" name="hobby" value="dance" >跳舞
                    <input type="checkbox" name="hobby" value="game" >打游戏
                </td>
            </tr>
            <tr>
                <td><label>籍贯：</label></td>
                <td>
                    <select name="native_place">
                        <option value="-1">--- 请选择 ---</option>
                        <option value="hn">湖南</option>
                        <option value="gd">广东</option>
                        <option value="sh">上海</option>
                        <option value="sz">深圳</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td><label>照片：</label></td>
                <td><input type="file" name="picture"></td>
            </tr>
            <tr>
                <td><label>备注：</label></td>
                <td><textarea name="remark" rows="2" cols="20"></textarea></td>
            </tr>
            <tr>

                <td colspan="2"><div id="sub_center"><input type="submit" value="提交" id="sub"></div></td>
<!--                <td><input type="reset" value="重置"></td>-->
            </tr>
        </from>
    </table>
</body>

</html>